<template>
	<view class="collect-page">
		<van-nav-bar title="我的收藏" left-text="返回" left-arrow @click-left="Back" />
		<view class="collect-wrap">
			<view class="blog-item" v-for="v,k in collect_list">
				<p>{{v.bolgTitle}}</p>
				<image :src="v.imgs" mode="widthFix"></image>
				<view class="blog-tip">
					<text style="color:#018EFF;">原创</text> <text style="color: #8a8a8a;">{{v.bolgWatch}} 浏览</text>
				</view>
			</view>
		</view>


	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue'

	import {
		onShow
	} from '@dcloudio/uni-app'

	import $api from '../../request/index.js'

	let collect_list = ref([])

	onShow(() => {
		console.log('页面显示')
		$api.get('/moto/User/bolg/favorite').then(res => {
			console.log(res.data)
			collect_list.value = res.data
		})
	})

	// 返回
	const Back = () => uni.navigateBack()
</script>

<style>
	.collect-wrap {
		height: calc(100vh - 46px);
		overflow-y: scroll;
	}

	.blog-item {
		box-sizing: border-box;
		padding: 20rpx;
		font-size: 14px;
		border-bottom: 1px solid #ddd;
	}

	.blog-item>p {
		margin: 10rpx 0;
	}

	.blog-item>image {
		width: 100%;
		border-radius: 10rpx;
	}

	.blog-tip>text {
		font-size: 12px;
	}

	.blog-tip {
		margin-top: 20rpx;
	}
</style>